// 源插件
import React, { Fragment, PureComponent } from 'react';
import { DateDiff, DateStamp, FormatnumberZero, Mover, NumberDivide } from '@/function.js';

// 视图插件
import {
  Button,
  Card,
  Col,
  DatePicker,
  Divider,
  Form,
  Input,
  message,
  notification,
  Row,
  Select,
  Switch,
} from 'antd';

// 外部组件
import PageHeaderWrapper from '@/components/PageHeaderWrapper';
import StandardTablePro from '@/components/UpgradeStandardTable/StandardTablePro';
import { connect } from 'dva';
// import AddAQDQ from "./AddAQDQ";
// import UpdateAQDQ from "./UpdateAQDQ";

// css OR less预编译器

// 图片
function getNowFormatDate(date) {
  const seperator1 = '-';
  const year = date.getFullYear();
  let month = date.getMonth() + 1;
  let strDate = date.getDate();
  if (month >= 1 && month <= 9) {
    month = `0${month}`;
  }
  if (strDate >= 0 && strDate <= 9) {
    strDate = `0${strDate}`;
  }
  const currentdate = year + seperator1 + month + seperator1 + strDate;
  return currentdate;
}
/**
 *  Describe:数据连接
 */

@connect(({ newTwoDaily }) => ({
  newTwoDaily,
}))
@Form.create()
class OptionAmend extends PureComponent {
  componentWillMount() {}

  /**
   *  Describe:当前状态
   */

  state = {
    listLoading: false, // 加载状态
    dataSource: {
      data: [],
      total: [],
      code: 0,
    },
    addVisible: false,
    updateVisible: false,
    row: {},
  };

  dataSourceChange(date) {
    const { dispatch } = this.props;
    const that = this;
    dispatch({
      type: 'newTwoDaily/GetOptionAmend',
      payload: date ? getNowFormatDate(date) : false,
      callback: res => {
        that.setState({
          dataSource: {
            title: '二号基金期权明细',
            code: res.code,
            data: res.list,
            total: ['profit', 'todayProfit', 'positionSize'],
            columns: [
              {
                title: '期权代码',
                dataIndex: 'optionCode',
                type: 'string',
                width: 160,
                search: true,
              },
              {
                title: '银行',
                dataIndex: 'bank',
                type: 'string',
                filters: [
                  {
                    text: '瑞银',
                    value: 1,
                  },
                  {
                    text: '花旗',
                    value: 2,
                  },
                ],
                render: (value, row, index) => {
                  let res = '';
                  if (value === 1) {
                    res = '瑞银';
                  }
                  if (value === 2) {
                    res = '花旗';
                  }
                  return <span>{res}</span>;
                },
              },
              {
                title: '类型',
                dataIndex: 'optionType',
                type: 'string',
                filters: [
                  {
                    text: 'SP',
                    value: 1,
                  },
                  {
                    text: 'SC',
                    value: 2,
                  },
                  {
                    text: 'BP',
                    value: 3,
                  },
                  {
                    text: 'BC',
                    value: 4,
                  },
                ],
                render: (value, row, index) => {
                  let res = '';
                  if (value === 1) {
                    res = 'SP';
                  }
                  if (value === 2) {
                    res = 'SC';
                  }
                  if (value === 3) {
                    res = 'BP';
                  }
                  if (value === 4) {
                    res = 'BC';
                  }
                  return <span>{res}</span>;
                },
              },
              {
                title: '数量',
                dataIndex: 'optionCount',
                type: 'number',
                sorter: true,
              },
              {
                title: '收盘价',
                dataIndex: 'close',
                type: 'number',
                sorter: true,
              },
              {
                title: '成本价',
                dataIndex: 'premium',
                type: 'number',
                sorter: true,
              },
             {
                title: '权利金',
               // dataIndex: 'premium',
               //  type: 'number',
               render:(value,row,index)=>{
                 if(index === 0 ){return null}
                 return <span>{window.mathService.mul(row.premium ,row.optionCount)}</span>
               }
              },
              {
                title: '盈利',
                dataIndex: 'profit',
                type: 'number',
                sorter: true,
              },
              {
                title: '昨收',
                dataIndex: 'lastClose',
                type: 'number',
                sorter: true,
              },
              {
                title: '今日盈利',
                dataIndex: 'todayProfit',
                type: 'number',
                sorter: true,
              },
              {
                title: '敞口',
                dataIndex: 'positionSize',
                type: 'number',
                sorter: true,
              },
              {
                title: '行权价',
                dataIndex: 'strikePrice',
                type: 'number',
                sorter: true,
              },
              {
                title: '距执行幅度',
                dataIndex: 'strikePercent',
                width: 110,
                type: 'number',
                sorter: true,
                render: (value, row, index) => {
                  return value === null ? null : (
                    <span>{NumberDivide(mathService.mul(value, 100), 2, '%')}</span>
                  );
                },
              },
              {
                title: '日期',
                dataIndex: 'date',
                width: 110,
                type: 'date',
                sorter: true,
                render: (value, row, index) => {
                  return <span>{typeof value === 'string' ? value.split(' ')[0] : ''}</span>;
                },
              },
              {
                title: '买入日期',
                dataIndex: 'buyDate',
                width: 110,
                type: 'date',
                sorter: true,
                render: (value, row, index) => {
                  return <span>{typeof value === 'string' ? value.split(' ')[0] : ''}</span>;
                },
              },
              {
                title: '有效期',
                dataIndex: 'expiry',
                width: 110,
                type: 'date',
                sorter: true,
                render: (value, row, index) => {
                  return <span>{typeof value === 'string' ? value.split(' ')[0] : ''}</span>;
                },
              },

              // {
              //   title: '操作',
              //   render: (text, record) => {
              //     if (record.type === '合计') {
              //       return null
              //     }
              //     return <Fragment>
              //       <a onClick={() => this.openUpdateVisible(record)}>修改</a>
              //       <Divider type="vertical" />
              //       <a onClick={() => this.deleteThis(record)}>删除</a>
              //     </Fragment>
              //   },
              // },
            ],
          },
        });
      },
    });
  }

  onSelectTime(e) {
    this.dataSourceChange(e._d);
  }

  openAddVisible() {
    this.setState({
      addVisible: true,
    });
  }

  closeAddVisbile() {
    const that = this;
    this.setState(
      {
        addVisible: false,
      },
      () => {
        that.dataSourceChange();
      }
    );
  }

  openUpdateVisible(row) {
    this.setState({
      row,
      updateVisible: true,
    });
  }

  closeUpdateVisbile() {
    const that = this;
    this.setState(
      {
        updateVisible: false,
      },
      () => {
        that.dataSourceChange();
      }
    );
  }

  deleteThis(row) {
    const that = this;
    const { dispatch } = this.props;
    dispatch({
      type: 'aqdq/DelAQDQ',
      payload: { id: row.id },
      callback: res => {
        that.dataSourceChange();
      },
    });
  }

  render() {
    const { addVisible, updateVisible, row, dataSource } = this.state;
    return (
      <PageHeaderWrapper>
        <Card>
          {/* <div style={{ display: 'flex', alignItems: 'center', marginRight: '30px' }}> */}
          {/* <div style={{ marginRight: '10px' }}>自动刷新</div> */}
          {/* <Switch */}
          {/* checkedChildren="开" */}
          {/* unCheckedChildren="关" */}
          {/* onChange={this.refreshControl.bind(this)} */}
          {/* /> */}
          {/* </div> */}
          {/* <br /> */}
          {/* <Button onClick={this.openAddVisible.bind(this)}>添加</Button> */}
          {/* <br /> */}
          {/* <br /> */}
          <Row>
            <Col md={24} sm={24}>
              选择时间：
              <DatePicker
                // showTime
                placeholder="请选择"
                format="YYYY-MM-DD"
                style={{ width: 200, margin: 4, marginBottom: 30 }}
                onChange={this.onSelectTime.bind(this)}
                onKeyPress={this.onSelectTime.bind(this)}
              />
            </Col>
          </Row>
          <StandardTablePro dataSource={dataSource} />
          {/* <AddAQDQ closeVisbile={this.closeAddVisbile.bind(this)} visible={addVisible} /> */}
          {/* <UpdateAQDQ */}
          {/* closeVisbile={this.closeUpdateVisbile.bind(this)} */}
          {/* visible={updateVisible} */}
          {/* row={row} */}
          {/* /> */}
        </Card>
      </PageHeaderWrapper>
    );
  }

  componentDidMount() {
    const that = this;
    this.dataSourceChange();
  }

  componentWillUnmount() {}
}

export default OptionAmend;
